<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <th:block th:include="include :: header('实体用况列表')" />
    <th:block th:include="include :: select2-css" />
</head>
<body>
    <div class="container-div">
        <div class="row">
            <div class="btn-group-sm" id="toolbar" role="group">
                <button class="btn btn-primary btn-rounded btn-sm" type="button" onclick="refreshTable()">刷新</button>
                <button class="btn btn-primary btn-rounded btn-sm" type="button" onclick="makeLicense()">制作证书</button>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table" class="text-nowrap table-bordered"></table>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: select2-js" />
    <script th:inline="javascript">
        var prefix = "http://code.suzhi.link:8070";
        var mvcPreFix = ctx + "toolbox/license"
        $(function() {
            $(function () {
                $('#bootstrap-table').bootstrapTable({
                    method: 'post',  //以post的方式发送请求
                    url: prefix + '/license/list',    //url地址，可以是接口也可以是本地json文件
                    striped: true, // 是否显示行间隔色
                    pageNumber: 1, // 初始化加载第一页
                    pagination: true, // 是否分页
                    sortable: true,  //是否可排序
                    // search: true,    //是否可查询
                    // showSearchClearButton: true, //显示搜索清除按钮
                    pageSize: 10, // 默认单页记录数
                    pageList: [10, 15, 20],   //分页可选页数
                    sidePagination: "client", //表示客户端请求
                    clickToSelect: true,                //是否启用点击选中行
                    //height: 500,                      //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
                    uniqueId: "id",                     //每一行的唯一标识，一般为主键列
                    // showToggle: true,                   //是否显示详细视图和列表视图的切换按钮
                    cardView: false,                    //是否显示详细视图
                    detailView: false,                  //是否显示父子表
                    onLoadSuccess: function () { //加载成功时执行
                        console.log("加载成功");
                    },
                    onLoadError: function () { //加载失败时执行
                        console.error("加载数据失败");
                    },
                    responseHandler: function (res) {
                        //在ajax获取到数据，渲染表格之前，修改数据源
                        //该项返回的为数据源内的二级列表data
                        if (res.errCode == "1") {
                            return res.data;
                        } else {
                            //显示报错信息
                            console.error(res);
                        }
                    },

                    paginationLoop: true,   //换页按钮设置
                    paginationHAlign: 'left',
                    paginationDetailHAlign: 'right',
                    paginationPreText: '上一页',
                    paginationNextText: '下一页',
                    columns: [{
                        checkbox: true  //左侧复选框，用于多选操作
                    }, {
                        title: '证书版本',
                        visible: true,
                        align: 'center',
                        valign: 'middle',
                        sortable: true,
                        formatter: function (value, row, index) {
                            return row;
                        }
                    }
                    ]
                });
                $('#bootstrap-table').bootstrapTable('hideLoading');

                // 点击表格中的行
                $("#bootstrap-table tr").click(function() {
                    // 获取行的ID
                    // 发送AJAX请求到后端获取数据
                    $.ajax({
                        url: "http://code.suzhi.link:8070/license/details",
                        type: "post",
                        dataType: "json",
                        contentType:"application/json",
                        data: JSON.stringify(data),
                        success: function(retData) {
                            // 显示模态框
                            $('#modal-text').text(retData);
                            $('#myModal').css('display', 'block');
                        }
                    });

                });
                // 点击模态框中的关闭按钮
                $('.close').click(function() {
                    $('#myModal').css('display', 'none');
                });

            });



        });

        function refreshTable() {
            $('#bootstrap-table').bootstrapTable("refresh");
        };

        function makeLicense() {
            $.operate.addTab2("License", mvcPreFix + "/add");
        };
    </script>
</body>
</html>


